import Taro, { Current } from "@tarojs/taro"
import { useState, useEffect } from 'react'
import { View, Text, Button } from '@tarojs/components'
import './index.less'
import Child from './child'

function Index() {

  const [userName, setUserName] = useState('Johnnie Wind')
  const [blogTitle, setBlogTitle] = useState('')
  const [introduce, setIntroduce] = useState('')

  // 建议在页面初始化时把 getCurrentInstance() 的结果保存下来供后面使用，
  // 而不是频繁地调用此 API
  const $instance = Taro.getCurrentInstance()

  useEffect(() => {
    // 方式1 用Current
    setBlogTitle(Current.router.params.blogTitle)
    // 方式2 用Taro Instance
    setIntroduce($instance.router.params.introduce)
  }, [])

  const changeName = () => {
    setUserName('伍政宇')
  }

  return (
    <View className='index'>
      <Text>{userName}</Text>
      <Child />
      <Button onClick={changeName}>点我换名字</Button>
      <View>{blogTitle}</View>
      <View>{introduce}</View>
    </View>
  )
}

export default Index
